<template>
  <div style="margin-left:6px;">
    <el-button
      v-bind="$attrs"
      class="filter-item"
      size="mini"
      type="success"
      icon="el-icon-check"
      @click="confirmApprove">审批办理</el-button>
    <!-- <el-button
      v-bind="$attrs"
      class="filter-item"
      size="mini"
      type="primary"
      icon="el-icon-user"
      @click="selectUser">委托</el-button> -->
    <el-dialog :visible.sync="dialog" title="审批办理确认" append-to-body width="450px">
      <el-form size="mini" label-width="100px">
        <el-form-item label="选择方式">
          <el-radio v-model="approveType" label="pass">通过</el-radio>
          <el-radio v-model="approveType" label="reject">驳回</el-radio>
        </el-form-item>
        <el-form-item label="输入意见">
          <el-input v-model="approveMsg" style="width: 320px;" rows="3" type="textarea"/>
        </el-form-item>
        <el-form-item label="抄送">
          <UserSelectDialog v-model="ccName" :multi-select="true" @userSelectCallback="userSelectCallback"/>
        </el-form-item>
        <el-form-item label="邮件通知">
          <el-checkbox v-model="emailNoticeFlag" true-label="Y" false-label="N" />
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="text" @click="cancel">取消</el-button>
        <el-button type="primary" @click="doMultiApprove">确认</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import UserSelectDialog from '@/views/components/UserSelectDialog'

export default {
  name: 'ApproveOpt',
  components: { UserSelectDialog },
  props: {
    sup_this: {
      type: Object,
      required: true
    }
  },
  data() {
    return {
      dialog: false,
      dialogVisible: false,
      approveType: 'pass',
      approveMsg: '',
      ccAccount: '',
      ccName: '',
      emailNoticeFlag: 'N'
    }
  },
  methods: {
    cancel() {
      this.dialog = false
    },
    confirmApprove() {
      const _thisParent = this.sup_this
      const selectedRows = _thisParent.selectedGridRows
      if (selectedRows.length === 0) {
        this.$message({
          message: '请选择记录',
          type: 'warning'
        })
        return
      }
      this.dialog = true
    },
    selectUser() {
      const _this = this.$refs.userSelectList
      _this.loadData()
      _this.dialog = true
    },
    userSelectCallback(selectedRows, userSelectObj) {
      this.ccAccount = ''
      this.ccName = ''
      selectedRows.forEach(row => {
        this.ccAccount = this.ccAccount + row.userAccount + ','
        this.ccName = this.ccName + row.userName + ','
      })
    },
    doMultiApprove() {
      const _thisParent = this.sup_this
      const selectIds = []
      _thisParent.selectedGridRows.forEach(row => {
        selectIds.push(row.id)
      })
      this.cancel()
      this.$emit('doMultiApprove', selectIds, this.approveType, this.approveMsg, this.ccAccount, this.ccName, this.emailNoticeFlag)
    }
  }
}
</script>

